<template>
   <div class="list-wrap">
     <div v-if="todos.length">
        <Item v-for="(item, index) in todos" :key="item" :todoItem="item" :index="index" :deleteTodo="deleteTodo" :updateTodo="updateTodo"/>
     </div>
     <div v-else>
       <span>暂无数据...</span>
     </div>
   </div>
</template>

<script lang="ts">
import { defineComponent } from 'vue';
import Item from './item.vue';
export default defineComponent({
  name: 'list',
  components: {
    Item,
  },
  props:['todos', 'deleteTodo', 'updateTodo'],
});
</script>
<style scoped>
.list-wrap {
  width: 90%;
  padding: 0 5%;
  height: 250px;
  /* border: 1px solid rgb(155, 155, 155); */
  overflow: scroll;
  margin-top: 10px;
}
</style>
